<template>
    <div class="login-wrapper">
        <Form>
            <card class="card">
                <strong slot="title">欢迎登陆</strong>
                <form-item prop="user">
                    <i-input type="text" placeholder="用户名" v-model="form.username" @keyup.enter="submit">
                        <icon type="ios-person" slot="prepend"></icon>
                    </i-input>
                </form-item>
                <form-item prop="user">
                    <i-input type="password" placeholder="密码" v-model="form.password" @keyup.enter="submit">
                        <icon type="ios-lock" slot="prepend"></icon>
                    </i-input>
                </form-item>
                <FormItem>
                    <Button type="primary" :loading="loading" @click="submit" long>登录</Button>
                </FormItem>
            </card>
        </Form>
    </div>
</template>
<script>
    import API from '@/lib/API_PATH'

    export default {
        name: 'login',
        data() {
            return {
                loading: false,
                form: {
                    username: '',
                    password: '',
                }
            }
        },
        created() {
        },
        mounted() {
        },
        methods: {
            async submit() {
                this.loading = true
                const {username, password} = this.form
                try {
                    const {data} = await this.$http.post(API.LOGIN, {username, password})
                    this.$utils.storeSet('token', data.token)
                    this.$router.replace('/')
                    this.$Message.success('登录成功')
                } catch (e) {
                    if (e.code === 404 || e.code === 402) {
                        this.$Message.error('用户名或密码错误，登录失败')
                    } else {
                        this.$Message.error('登录失败')
                    }
                }
                this.loading = false
            }
        },
        components: {}
    }
</script>
<style lang="scss">
    @import "../assets/scss/modules/login";
</style>
